<template>
  <div>
    <a-popconfirm
      title="确认关闭?如果有内容变更,先保存."
      ok-text="确认"
      cancel-text="取消"
      @confirm="confirm"
    >
      <close-square-outlined style="font-size: 30px;padding: 10px 20px;"/>
    </a-popconfirm>
    <a-input  v-model:value="ipt"/>
    <md-editor v-model="text"/>
  </div>
</template>

<script lang="ts" setup>
import MdEditor from "md-editor-v3";
import "md-editor-v3/lib/style.css";
import { CloseSquareOutlined } from "@ant-design/icons-vue";
import { ref ,onMounted} from "vue";
import { useRoute } from "vue-router";
import {postsDetail,editor} from "@/api/editor"
const route=useRoute()
const id=route.params.id
const text = ref("");
const ipt=ref("")
const getData=async()=>{
  let resp=await postsDetail(id)
  ipt.value=resp.data.data.headline
  text.value=resp.data.data.content
}
onMounted(() => {
  getData()
})

const confirm =async () => {
  let resp=await editor({ipt:ipt.value,text:text.value,id:id})
};
</script>

<style scoped lang="scss">
.ant-input{
  border: none;
  border-bottom: 1px solid;
  width: 200px;
}
</style>
